<template>
  <div class="home">
    <Layout :style="{padding: '0 24px 24px'}">
      <Breadcrumb :style="{margin: '24px 0'}">
        <BreadcrumbItem>产品中心</BreadcrumbItem>
        <BreadcrumbItem>资金解决方案</BreadcrumbItem>
      </Breadcrumb>
      <Content :style="{padding: '24px 182px 24px 24px', minHeight: this.$h.GetContentBodyHeight()+'px', background: '#fff'}">
        <div class="con_body">
          <ul >
            <li v-for="item in textarr" @click="fun(item)">
              <div class="img_icon">
                <img :src="item.img" alt="">
              </div>
              <div class="con_body_text">
                <h3>{{item.title}}</h3>
                <p>{{item.text}}</p>
              </div>
            </li>
          </ul>
        </div>
      </Content>
    </Layout>
  </div>
</template>
<script>
  import yyzh from '~/text/yyzh.png';
  import zdtx from '~/text/zdtx.png';
  export default {
    props: {},
    components: {},
    data() {
      return {
        textarr:[
          {
            'img':yyzh,
            'title':'运营账户',
            'text':'将交易之外的其他运营资金管理单独管理',
            'flag':'0'
          },
          {
            'img':zdtx,
            'title':'自动提现',
            'text':'定期自动将交易款转至银行账户中',
            'flag':'0'
          },
        ]
      }
    },
    methods: {
      fun(item){
        switch (item.flag) {
          case '0':
            this.$Message.success('暂未开通');
            break;
          case '1':
            this.$Message.success('已成功开通');
            break;
        }
      }
    },
    watch: {},
    computed: {},
    created() {
    },
    mounted() {
    }
  }
</script>
<style scoped>
  .home {
    width: 100%;
    height: 100%;
  }

  .con_body {
    width:100%;
    height:100%;
  }

  .con_body ul {
    width:100%;
    height:100%;
    padding: 0;
    margin: 0;
    list-style:none;
  }

  .con_body ul li {
    height: 101px;
    float: left;
    width: 297px;
    border: 1px solid #e7e7eb;
    margin-right: 7%;
    margin-bottom: 20px;
  }
  .img_icon{
    width: 100px;
    height: 100%;
    overflow: hidden;
    float: left;
  }
  .img_icon img{
    width: 58px;
    height: 58px;
    display: block;
    margin: 20px auto auto auto;
    background: #4fbc2d;
    border-radius: 50%;

  }
  .con_body_text{
    float: left;
    width:195px;
    height:100%;
    padding: 28px 5px 17px 0px;
  }

</style>
